<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        body{
            margin:0; padding:0;}
        div {
            position: relative;
        }
        #div_top {
            background-color:orange;
            height: 20%;
        }
        #div_left {
            background-color: greenyellow;
            height: 80%;
            width: 15%;
            float: left;
        }
            #div_main {
                background-color: whitesmoke;
                height: 70%;
                float: left;
                width: 85%;
            }
        #div_bottom {
            background-color: sandybrown;
            height: 10%;
            width: 85%;
            float: left;
        }
        </style>

</head>
<body>
<div id="div_top">div top</div>
<div id="div_left">div left <br/>div left </div>
<div id="div_main">div main</div>
<div id="div_bottom">div bottom</div>
</body>
</html>